<template>
  <p-drawer
    placement="right"
    :closable="false"
    width="calc(100vw - 200px)"
    :visible="visible"
    :mask-closable="false"
    :destroy-on-close="true"
    :z-index="1000"
    @close="onClose"
  >
    <TaskTitle title-name="新增潜客 - 基本信息" />
    <div class="g-drawer-list-container">
      <CustomerBasicInfo ref="formBasicInfo" />
    </div>
    <ButtonGroup
      class="g-drawer-footer"
      :options="footerButtons"
      @click="handleButtonClick"
    />
  </p-drawer>
</template>

<script>
import CustomerBasicInfo from '@/components/task/CustomerBasicInfo.vue';

import {
  postSaveCustomerCreate,
  postInspectionRepeat
} from '@/api/customerApi.js';

import DrawerMixin from './mixin';

export default {
  components: {
    CustomerBasicInfo,
  },
  mixins: [DrawerMixin],
  props: {
  },
  data() {
    return {
      loading: false,
      forms: {},
      visibled: false,
    };
  },

  computed: {
    footerButtons() {
      return [
        {
          key: 'submit',
          type: 'primary',
          label: '提交',
          auth: true,
        },
        {
          key: 'save',
          label: '保存',
          auth: true,
        },
        {
          key: 'close',
          label: '返回',
        },
      ];
    },
  },
  watch: {},

  methods: {
    async validate() {
      const result = await this.$refs.form.validate();
      // console.log(result);
      if (result) {
        this.visibled = true;
      }
    },
    onClose() {
      this.$emit('update:visible', false);
      this.$emit('fresh');
    },
    getform(val) {
      this.forms = val;
    },
    async submitData(data, operating) {
      const valid = await this.$refs.formBasicInfo.validate();

      if (!valid) return new Promise(() => {});
      // console.log(data);
      if (valid) {
        // const result = await postIdOrUpdate({
        //   bizModule: 'CUSTOMER_CREATE',
        //   currStatus: operating,
        // });

        // const processId = result?.data.data;
        return await postSaveCustomerCreate({
          ...data,
          salesGroupCode: data.salesGroupCode,
          pmGroupCode: data.pmGroupCode,
          proStatus: operating,
        });
      }
    },
    async getSubmit() {
      const data = this.$refs.formBasicInfo.form;
      const address = this.$refs.formBasicInfo.rulesAddress
      const remark = this.$refs.formBasicInfo.rulesRemark
      const rulesWebsite = this.$refs.formBasicInfo.rulesWebsite
      let resCustomerName = await postInspectionRepeat({ customerName: data.customerName });
      let resName = await postInspectionRepeat({ name: data.name });
      let customerName = resCustomerName?.data?.data
      let name = resName?.data?.data
      if (data.customerName && !customerName) {
        this.$message.error('该客户名称已被占用');
        return;
      }
      if (data.name && !name) {
        this.$message.error('该客户简称已被占用');
        return;
      }
       if (address) {
        this.$message.error('详细地址输入内容过长');
        return;
      }
      if (rulesWebsite) {
        this.$message.error('网站地址输入内容过长');
        return;
      }
      if (remark) {
        this.$message.error('备注输入内容过长');
        return;
      }
      const result = await this.submitData(data, '2');
      if (result?.data?.code === 0) {
        this.$message.success('提交成功！');
      }
      this.closeCallback();
    },
    async saveCallback() {
      const data = this.$refs.formBasicInfo.form;
      const address = this.$refs.formBasicInfo.rulesAddress
      const remark = this.$refs.formBasicInfo.rulesRemark
      const rulesWebsite = this.$refs.formBasicInfo.rulesWebsite
      console.log(data)
      let resCustomerName = await postInspectionRepeat({ customerName: data.customerName });
      let resName = await postInspectionRepeat({ name: data.name });
      let customerName = resCustomerName?.data?.data
      let name = resName?.data?.data
      if (data.customerName && !customerName) {
        this.$message.error('该客户名称已被占用');
        return;
      }
      if (data.name && !name) {
        this.$message.error('该客户简称已被占用');
        return;
      }
      if (address) {
        this.$message.error('详细地址输入内容过长');
        return;
      }
      if (rulesWebsite) {
        this.$message.error('网站地址输入内容过长');
        return;
      }
      if (remark) {
        this.$message.error('备注输入内容过长');
        return;
      }
      
      const result = await this.submitData(data, '1');
      if (result?.data?.code === 0) {
        this.$message.success('保存成功！');
      }
      this.closeCallback();
    },
    closeCallback() {
      this.onClose();
    },
    handleButtonClick(key) {
      const fn = `${key}Callback`;
      this[fn] && this[fn]();
    },
  },
};
</script>
